themes: Fix and improve linked button style
authornana-4 <hnmaigo@gmail.com>
Mon, 8 Apr 2019 15:40:38 +0000 (00:40 +0900)
committernana-4 <hnmaigo@gmail.com>
Mon, 8 Apr 2019 17:27:41 +0000 (02:27 +0900)
Instead of re-styling the border and radius of the linked buttons
depending on the position (middle, first, last, or only child), just
remove the border and radius in a specific direction when the button is
`:not(:first-child)` and/or `:not(:last-child)`.

This properly handles the style of linked buttons in all positions
-- middle, first, last, and only child.

Fixes #1294

gtk/theme/Adwaita/_common.scss
gtk/theme/Adwaita/gtk-contained-dark.css
gtk/theme/Adwaita/gtk-contained.css
gtk/theme/HighContrast/_common.scss
gtk/theme/HighContrast/gtk-contained-inverse.css
gtk/theme/HighContrast/gtk-contained.css

index 44e6fde53434cb0e23f8642ba599945d2dfa484e..f26a9bc1983961a2dcdc734795e8b13b37702b1c 100644 (file)
@@ -833,25 +833,13 @@ button {
   &.font { > box > box > label { font-weight: bold; }}
 
   // inline-toolbar buttons
-  .inline-toolbar &, .inline-toolbar &:backdrop {
-    border-radius: 2px;
-    border-width: 1px;
-    @extend %linked;
-  }
+  .inline-toolbar & { @extend %linked; }
 
   .primary-toolbar & { -gtk-icon-shadow: none; } // tango icons don't need shadows
 
-  .linked > &,
-  .linked > &:hover,
-  .linked > &:active,
-  .linked > &:checked,
-  .linked > &:backdrop { @extend %linked; }
+  .linked:not(.vertical) > & { @extend %linked; }
 
-  .linked.vertical > &,
-  .linked.vertical > &:hover,
-  .linked.vertical > &:active,
-  .linked.vertical > &:checked,
-  .linked.vertical > &:backdrop { @extend %linked_vertical; }
+  .linked.vertical > & { @extend %linked_vertical; }
 
   &.circular { // The Bloody Circul Button
     border-radius: 9999px;
@@ -942,80 +930,45 @@ button {
 }
 
 // More inline toolbar buttons
-toolbar.inline-toolbar toolbutton,
-toolbar.inline-toolbar toolbutton:backdrop {
-  > button.flat { @extend %linked_middle; }
-
-  &:first-child > button.flat { @extend %linked:first-child; }
-
-  &:last-child > button.flat { @extend %linked:last-child; }
-
-  &:only-child > button.flat { @extend %linked:only-child; }
+toolbar.inline-toolbar toolbutton {
+  &:not(:first-child) > button.flat { @extend %linked:not(:first-child); }
+  &:not(:last-child) > button.flat { @extend %linked:not(:last-child); }
 }
 
-%linked_middle {
-  border-radius: 0;
-  border-right-style: none;
+%linked_not_left {
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
 }
 
-%linked_left {
-    border-top-left-radius: $button_radius;
-    border-bottom-left-radius: $button_radius;
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-    border-right-style: none;
-}
-
-%linked_right {
-    border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
-    border-top-right-radius: $button_radius;
-    border-bottom-right-radius: $button_radius;
-    border-right-style: solid;
+%linked_not_right {
+  border-right-style: none;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
 }
 
 // 1st/last child are at text start/end
 %linked {
-  @extend %linked_middle;
-
   &:dir(ltr) {
-    &:first-child { @extend %linked_left; }
-    &:last-child { @extend %linked_right; }
+    &:not(:first-child) { @extend %linked_not_left; }
+    &:not(:last-child) { @extend %linked_not_right; }
   }
 
   &:dir(rtl) {
-    &:first-child { @extend %linked_right; }
-    &:last-child { @extend %linked_left; }
-  }
-
-  &:only-child {
-    border-radius: $button_radius;
-    border-style: solid;
+    &:not(:first-child) { @extend %linked_not_right; }
+    &:not(:last-child) { @extend %linked_not_left; }
   }
 }
 
-%linked_vertical_middle {
-  border-style: solid solid none solid;
-  border-radius: 0;
-}
-
 %linked_vertical{
-  @extend %linked_vertical_middle;
-
-  &:first-child {
-    border-top-left-radius: $button_radius;
-    border-top-right-radius: $button_radius;
-  }
-
-  &:last-child {
-    border-bottom-left-radius: $button_radius;
-    border-bottom-right-radius: $button_radius;
-    border-style: solid;
+  &:not(:first-child) {
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
   }
 
-  &:only-child {
-    border-radius: $button_radius;
-    border-style: solid;
+  &:not(:last-child) {
+    border-bottom-style: none;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
   }
 }
 
@@ -1319,13 +1272,15 @@ spinbutton {
     }
 
     %top_button {
-      border-radius: $button_radius $button_radius 0 0;
-      border-style: solid solid none solid;
+      border-bottom-style: none;
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
     }
 
     %bottom_button {
-      border-radius: 0 0 $button_radius $button_radius;
-      border-style: none solid solid solid;
+      border-top-style: none;
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
     }
   }
 
@@ -1367,10 +1322,7 @@ combobox {
   }
 
   &.linked {
-    button:nth-child(2) {
-      &:dir(ltr) { @extend %linked:last-child; }
-      &:dir(rtl) { @extend %linked:first-child; }
-    }
+    button:nth-child(2) { @extend %linked:not(:first-child); }
   }
 
   &:drop(active) { // FIXME: untested
@@ -1380,23 +1332,19 @@ combobox {
   }
 }
 
-.linked > combobox > box > button.combo {
-  // the combo is a composite widget so the way we do button linking doesn't
-  // work, special case needed. See
-  // https://bugzilla.gnome.org/show_bug.cgi?id=733979
+// the combo is a composite widget so the way we do button linking doesn't
+// work, special case needed. See
+// https://bugzilla.gnome.org/show_bug.cgi?id=733979
 
-  &:dir(ltr),
-  &:dir(rtl) { @extend %linked_middle; } // specificity bump
+.linked:not(.vertical) > combobox {
+  &:not(:first-child) > box > button.combo { @extend %linked:not(:first-child); }
+  &:not(:last-child) > box > button.combo { @extend %linked:not(:last-child); }
 }
 
-.linked:not(.vertical) > combobox:first-child > box > button.combo { @extend %linked:first-child; }
-.linked:not(.vertical) > combobox:last-child > box > button.combo { @extend %linked:last-child; }
-.linked:not(.vertical) > combobox:only-child > box > button.combo { @extend %linked:only-child; }
-
-.linked.vertical > combobox > box > button.combo { @extend %linked_vertical_middle; }
-.linked.vertical > combobox:first-child > box > button.combo { @extend %linked_vertical:first-child;}
-.linked.vertical > combobox:last-child > box > button.combo { @extend %linked_vertical:last-child; }
-.linked.vertical > combobox:only-child > box > button.combo { @extend %linked_vertical:only-child; }
+.linked.vertical > combobox {
+  &:not(:first-child) > box > button.combo { @extend %linked_vertical:not(:first-child); }
+  &:not(:last-child) > box > button.combo { @extend %linked_vertical:not(:last-child); }
+}
 
 
 /************
index 51f77d44931a0935e74131e601bcfb0f6e486639..51c513a5bca264dbf566305331936a964c6f4f2b 100644 (file)
@@ -388,8 +388,6 @@ button.font separator, button.file separator { background-color: transparent; }
 
 button.font > box > box > label { font-weight: bold; }
 
-.inline-toolbar button, .inline-toolbar button:backdrop { border-radius: 2px; border-width: 1px; }
-
 .primary-toolbar button { -gtk-icon-shadow: none; }
 
 button.circular { border-radius: 9999px; -gtk-outline-radius: 9999px; background-origin: padding-box, border-box; background-clip: padding-box, border-box; }
@@ -436,21 +434,13 @@ button.circular:hover:not(:checked):not(:active):not(:disabled):not(:backdrop) {
 
 .inline-toolbar toolbutton > button:backdrop:disabled:active label, .inline-toolbar toolbutton > button:backdrop:disabled:checked label { color: #5b5b5b; }
 
-toolbar.inline-toolbar toolbutton > button.flat, toolbar.inline-toolbar toolbutton:backdrop > button.flat, .linked:not(.vertical) > spinbutton:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text, .linked:not(.vertical) > entry, .inline-toolbar button, .inline-toolbar button:backdrop, .linked > button, .linked > button:hover, .linked > button:active, .linked > button:checked, .linked > button:backdrop, .linked > combobox > box > button.combo:dir(ltr), .linked > combobox > box > button.combo:dir(rtl) { border-radius: 0; border-right-style: none; }
-
-.linked:not(.vertical) > spinbutton:dir(ltr):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):first-child, .linked:not(.vertical) > entry:dir(ltr):first-child, .inline-toolbar button:dir(ltr):first-child, .linked > button:dir(ltr):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):last-child, .linked:not(.vertical) > entry:dir(rtl):last-child, .inline-toolbar button:dir(rtl):last-child, .linked > button:dir(rtl):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(rtl) { border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-right-style: none; }
-
-.linked:not(.vertical) > spinbutton:dir(ltr):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):last-child, .linked:not(.vertical) > entry:dir(ltr):last-child, .inline-toolbar button:dir(ltr):last-child, .linked > button:dir(ltr):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):first-child, .linked:not(.vertical) > entry:dir(rtl):first-child, .inline-toolbar button:dir(rtl):first-child, .linked > button:dir(rtl):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-right-style: solid; }
-
-.linked:not(.vertical) > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:only-child, .linked:not(.vertical) > entry:only-child, .inline-toolbar button:only-child, .linked > button:only-child, toolbar.inline-toolbar toolbutton:only-child > button.flat, toolbar.inline-toolbar toolbutton:backdrop:only-child > button.flat, .linked:not(.vertical) > combobox:only-child > box > button.combo { border-radius: 5px; border-style: solid; }
-
-.linked.vertical > spinbutton:not(.vertical), spinbutton.vertical .linked.vertical > text, .linked.vertical > entry, .linked.vertical > button, .linked.vertical > button:hover, .linked.vertical > button:active, .linked.vertical > button:checked, .linked.vertical > button:backdrop, .linked.vertical > combobox > box > button.combo { border-style: solid solid none solid; border-radius: 0; }
+.linked:not(.vertical) > spinbutton:dir(ltr):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:first-child), .linked:not(.vertical) > entry:dir(ltr):not(:first-child), .inline-toolbar button:dir(ltr):not(:first-child), .linked:not(.vertical) > button:dir(ltr):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:last-child), .linked:not(.vertical) > entry:dir(rtl):not(:last-child), .inline-toolbar button:dir(rtl):not(:last-child), .linked:not(.vertical) > button:dir(rtl):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
 
-.linked.vertical > spinbutton:first-child:not(.vertical), spinbutton.vertical .linked.vertical > text:first-child, .linked.vertical > entry:first-child, .linked.vertical > button:first-child, .linked.vertical > combobox:first-child > box > button.combo { border-top-left-radius: 5px; border-top-right-radius: 5px; }
+.linked:not(.vertical) > spinbutton:dir(ltr):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:last-child), .linked:not(.vertical) > entry:dir(ltr):not(:last-child), .inline-toolbar button:dir(ltr):not(:last-child), .linked:not(.vertical) > button:dir(ltr):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:first-child), .linked:not(.vertical) > entry:dir(rtl):not(:first-child), .inline-toolbar button:dir(rtl):not(:first-child), .linked:not(.vertical) > button:dir(rtl):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(rtl) { border-right-style: none; border-top-right-radius: 0; border-bottom-right-radius: 0; }
 
-.linked.vertical > spinbutton:last-child:not(.vertical), spinbutton.vertical .linked.vertical > text:last-child, .linked.vertical > entry:last-child, .linked.vertical > button:last-child, .linked.vertical > combobox:last-child > box > button.combo { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-style: solid; }
+.linked.vertical > spinbutton:not(:first-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:first-child), .linked.vertical > entry:not(:first-child), .linked.vertical > button:not(:first-child), .linked.vertical > combobox:not(:first-child) > box > button.combo { border-top-left-radius: 0; border-top-right-radius: 0; }
 
-.linked.vertical > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked.vertical > text:only-child, .linked.vertical > entry:only-child, .linked.vertical > button:only-child, .linked.vertical > combobox:only-child > box > button.combo { border-radius: 5px; border-style: solid; }
+.linked.vertical > spinbutton:not(:last-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:last-child), .linked.vertical > entry:not(:last-child), .linked.vertical > button:not(:last-child), .linked.vertical > combobox:not(:last-child) > box > button.combo { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
 
 modelbutton.flat, .menuitem.button.flat, modelbutton.flat:backdrop, modelbutton.flat:backdrop:hover, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, list row button, button:link, button:visited, button:link:hover, button:link:active, button:link:checked, button:visited:hover, button:visited:active, button:visited:checked, calendar.button, .scale-popup button:hover, .scale-popup button:backdrop:hover, .scale-popup button:backdrop:disabled, .scale-popup button:backdrop { background-color: transparent; background-image: none; border-color: transparent; box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); text-shadow: none; -gtk-icon-shadow: none; }
 
@@ -553,9 +543,9 @@ spinbutton.vertical text { min-height: 32px; min-width: 32px; padding: 0; border
 
 spinbutton.vertical button { min-height: 32px; min-width: 32px; padding: 0; }
 
-spinbutton.vertical button.up { border-radius: 5px 5px 0 0; border-style: solid solid none solid; }
+spinbutton.vertical button.up { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
 
-spinbutton.vertical button.down { border-radius: 0 0 5px 5px; border-style: none solid solid solid; }
+spinbutton.vertical button.down { border-top-style: none; border-top-left-radius: 0; border-top-right-radius: 0; }
 
 .osd spinbutton.vertical button:first-child { color: #eeeeec; border-color: rgba(0, 0, 0, 0.7); background-color: transparent; background-image: image(rgba(36, 33, 42, 0.7)); background-clip: padding-box; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); text-shadow: 0 1px black; -gtk-icon-shadow: 0 1px black; outline-color: rgba(238, 238, 236, 0.3); }
 
index 5a5d58f235dad2a49d46f240feb2b1ed6e3d23fe..84f8b4230da64384492626dbc94bb3c94046f0e3 100644 (file)
@@ -390,8 +390,6 @@ button.font separator, button.file separator { background-color: transparent; }
 
 button.font > box > box > label { font-weight: bold; }
 
-.inline-toolbar button, .inline-toolbar button:backdrop { border-radius: 2px; border-width: 1px; }
-
 .primary-toolbar button { -gtk-icon-shadow: none; }
 
 button.circular { border-radius: 9999px; -gtk-outline-radius: 9999px; background-origin: padding-box, border-box; background-clip: padding-box, border-box; }
@@ -438,21 +436,13 @@ button.circular:hover:not(:checked):not(:active):not(:disabled):not(:backdrop) {
 
 .inline-toolbar toolbutton > button:backdrop:disabled:active label, .inline-toolbar toolbutton > button:backdrop:disabled:checked label { color: #d4cfca; }
 
-toolbar.inline-toolbar toolbutton > button.flat, toolbar.inline-toolbar toolbutton:backdrop > button.flat, .linked:not(.vertical) > spinbutton:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text, .linked:not(.vertical) > entry, .inline-toolbar button, .inline-toolbar button:backdrop, .linked > button, .linked > button:hover, .linked > button:active, .linked > button:checked, .linked > button:backdrop, .linked > combobox > box > button.combo:dir(ltr), .linked > combobox > box > button.combo:dir(rtl) { border-radius: 0; border-right-style: none; }
-
-.linked:not(.vertical) > spinbutton:dir(ltr):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):first-child, .linked:not(.vertical) > entry:dir(ltr):first-child, .inline-toolbar button:dir(ltr):first-child, .linked > button:dir(ltr):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):last-child, .linked:not(.vertical) > entry:dir(rtl):last-child, .inline-toolbar button:dir(rtl):last-child, .linked > button:dir(rtl):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(rtl) { border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-right-style: none; }
-
-.linked:not(.vertical) > spinbutton:dir(ltr):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):last-child, .linked:not(.vertical) > entry:dir(ltr):last-child, .inline-toolbar button:dir(ltr):last-child, .linked > button:dir(ltr):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):first-child, .linked:not(.vertical) > entry:dir(rtl):first-child, .inline-toolbar button:dir(rtl):first-child, .linked > button:dir(rtl):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-right-style: solid; }
-
-.linked:not(.vertical) > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:only-child, .linked:not(.vertical) > entry:only-child, .inline-toolbar button:only-child, .linked > button:only-child, toolbar.inline-toolbar toolbutton:only-child > button.flat, toolbar.inline-toolbar toolbutton:backdrop:only-child > button.flat, .linked:not(.vertical) > combobox:only-child > box > button.combo { border-radius: 5px; border-style: solid; }
-
-.linked.vertical > spinbutton:not(.vertical), spinbutton.vertical .linked.vertical > text, .linked.vertical > entry, .linked.vertical > button, .linked.vertical > button:hover, .linked.vertical > button:active, .linked.vertical > button:checked, .linked.vertical > button:backdrop, .linked.vertical > combobox > box > button.combo { border-style: solid solid none solid; border-radius: 0; }
+.linked:not(.vertical) > spinbutton:dir(ltr):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:first-child), .linked:not(.vertical) > entry:dir(ltr):not(:first-child), .inline-toolbar button:dir(ltr):not(:first-child), .linked:not(.vertical) > button:dir(ltr):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:last-child), .linked:not(.vertical) > entry:dir(rtl):not(:last-child), .inline-toolbar button:dir(rtl):not(:last-child), .linked:not(.vertical) > button:dir(rtl):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
 
-.linked.vertical > spinbutton:first-child:not(.vertical), spinbutton.vertical .linked.vertical > text:first-child, .linked.vertical > entry:first-child, .linked.vertical > button:first-child, .linked.vertical > combobox:first-child > box > button.combo { border-top-left-radius: 5px; border-top-right-radius: 5px; }
+.linked:not(.vertical) > spinbutton:dir(ltr):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:last-child), .linked:not(.vertical) > entry:dir(ltr):not(:last-child), .inline-toolbar button:dir(ltr):not(:last-child), .linked:not(.vertical) > button:dir(ltr):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:first-child), .linked:not(.vertical) > entry:dir(rtl):not(:first-child), .inline-toolbar button:dir(rtl):not(:first-child), .linked:not(.vertical) > button:dir(rtl):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(rtl) { border-right-style: none; border-top-right-radius: 0; border-bottom-right-radius: 0; }
 
-.linked.vertical > spinbutton:last-child:not(.vertical), spinbutton.vertical .linked.vertical > text:last-child, .linked.vertical > entry:last-child, .linked.vertical > button:last-child, .linked.vertical > combobox:last-child > box > button.combo { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-style: solid; }
+.linked.vertical > spinbutton:not(:first-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:first-child), .linked.vertical > entry:not(:first-child), .linked.vertical > button:not(:first-child), .linked.vertical > combobox:not(:first-child) > box > button.combo { border-top-left-radius: 0; border-top-right-radius: 0; }
 
-.linked.vertical > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked.vertical > text:only-child, .linked.vertical > entry:only-child, .linked.vertical > button:only-child, .linked.vertical > combobox:only-child > box > button.combo { border-radius: 5px; border-style: solid; }
+.linked.vertical > spinbutton:not(:last-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:last-child), .linked.vertical > entry:not(:last-child), .linked.vertical > button:not(:last-child), .linked.vertical > combobox:not(:last-child) > box > button.combo { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
 
 modelbutton.flat, .menuitem.button.flat, modelbutton.flat:backdrop, modelbutton.flat:backdrop:hover, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, list row button, button:link, button:visited, button:link:hover, button:link:active, button:link:checked, button:visited:hover, button:visited:active, button:visited:checked, calendar.button, .scale-popup button:hover, .scale-popup button:backdrop:hover, .scale-popup button:backdrop:disabled, .scale-popup button:backdrop { background-color: transparent; background-image: none; border-color: transparent; box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); text-shadow: none; -gtk-icon-shadow: none; }
 
@@ -561,9 +551,9 @@ spinbutton.vertical text { min-height: 32px; min-width: 32px; padding: 0; border
 
 spinbutton.vertical button { min-height: 32px; min-width: 32px; padding: 0; }
 
-spinbutton.vertical button.up { border-radius: 5px 5px 0 0; border-style: solid solid none solid; }
+spinbutton.vertical button.up { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
 
-spinbutton.vertical button.down { border-radius: 0 0 5px 5px; border-style: none solid solid solid; }
+spinbutton.vertical button.down { border-top-style: none; border-top-left-radius: 0; border-top-right-radius: 0; }
 
 .osd spinbutton.vertical button:first-child { color: #eeeeec; border-color: rgba(0, 0, 0, 0.7); background-color: transparent; background-image: image(rgba(36, 33, 42, 0.7)); background-clip: padding-box; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); text-shadow: 0 1px black; -gtk-icon-shadow: 0 1px black; outline-color: rgba(238, 238, 236, 0.3); }
 
index e98c7324c13a1b2e063da4739aaa983195cd648a..123921230dc08e938edfd8f323bf87a68c04b42e 100644 (file)
@@ -680,25 +680,13 @@ button {
   }
 
   //inline-toolbar buttons
-  .inline-toolbar &, .inline-toolbar &:backdrop {
-    border-radius: 2px;
-    border-width: 1px;
-    @extend %linked;
-  }
+  .inline-toolbar & { @extend %linked; }
 
   .primary-toolbar & { -gtk-icon-shadow: none; } // tango icons don't need shadows
 
-  .linked > &,
-  .linked > &:hover,
-  .linked > &:active,
-  .linked > &:checked,
-  .linked > &:backdrop { @extend %linked; }
+  .linked:not(.vertical) > & { @extend %linked; }
 
-  .linked.vertical > &,
-  .linked.vertical > &:hover,
-  .linked.vertical > &:active,
-  .linked.vertical > &:checked,
-  .linked.vertical > &:backdrop { @extend %linked_vertical; }
+  .linked.vertical > & { @extend %linked_vertical; }
 }
 
 %needs_attention {
@@ -749,80 +737,45 @@ button {
 }
 
 // More inline toolbar buttons
-toolbar.inline-toolbar toolbutton,
-toolbar.inline-toolbar toolbutton:backdrop {
-  & > button.flat { @extend %linked_middle; }
-
-  &:first-child > button.flat { @extend %linked:first-child; }
-
-  &:last-child > button.flat { @extend %linked:last-child; }
-
-  &:only-child > button.flat { @extend %linked:only-child; }
-}
-
-%linked_middle {
-  border-radius: 0;
-  border-right-style: none;
+toolbar.inline-toolbar toolbutton {
+  &:not(:first-child) > button.flat { @extend %linked:not(:first-child); }
+  &:not(:last-child) > button.flat { @extend %linked:not(:last-child); }
 }
 
-%linked_left {
-    border-top-left-radius: 3px;
-    border-bottom-left-radius: 3px;
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-    border-right-style: none;
+%linked_not_left {
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
 }
 
-%linked_right {
-    border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
-    border-top-right-radius: 3px;
-    border-bottom-right-radius: 3px;
-    border-right-style: solid;
+%linked_not_right {
+  border-right-style: none;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
 }
 
 // 1st/last child are at text start/end
 %linked {
-  @extend %linked_middle;
-
   &:dir(ltr) {
-    &:first-child { @extend %linked_left; }
-    &:last-child { @extend %linked_right; }
+    &:not(:first-child) { @extend %linked_not_left; }
+    &:not(:last-child) { @extend %linked_not_right; }
   }
 
   &:dir(rtl) {
-    &:first-child { @extend %linked_right; }
-    &:last-child { @extend %linked_left; }
-  }
-
-  &:only-child {
-    border-radius: 3px;
-    border-style: solid;
+    &:not(:first-child) { @extend %linked_not_right; }
+    &:not(:last-child) { @extend %linked_not_left; }
   }
 }
 
-%linked_vertical_middle {
-  border-style: solid solid none solid;
-  border-radius: 0;
-}
-
 %linked_vertical{
-  @extend %linked_vertical_middle;
-
-  &:first-child {
-    border-top-left-radius: 3px;
-    border-top-right-radius: 3px;
-  }
-
-  &:last-child {
-    border-bottom-left-radius: 3px;
-    border-bottom-right-radius: 3px;
-    border-style: solid;
+  &:not(:first-child) {
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
   }
 
-  &:only-child {
-    border-radius: 3px;
-    border-style: solid;
+  &:not(:last-child) {
+    border-bottom-style: none;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
   }
 }
 
@@ -1087,13 +1040,15 @@ spinbutton {
     }
 
     %top_button {
-      border-radius: 3px 3px 0 0;
-      border-style: solid solid none solid;
+      border-bottom-style: none;
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
     }
 
     %bottom_button {
-      border-radius: 0 0 3px 3px;
-      border-style: none solid solid solid;
+      border-top-style: none;
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
     }
   }
 
@@ -1134,10 +1089,7 @@ combobox {
   }
 
   &.linked {
-    button:nth-child(2) {
-      &:dir(ltr) { @extend %linked:last-child; }
-      &:dir(rtl) { @extend %linked:first-child; }
-    }
+    button:nth-child(2) { @extend %linked:not(:first-child); }
   }
 
   &:drop(active) { // FIXME: untested
@@ -1147,23 +1099,19 @@ combobox {
   }
 }
 
-.linked > combobox > box > button.combo {
-  // the combo is a composite widget so the way we do button linking doesn't
-  // work, special case needed. See
-  // https://bugzilla.gnome.org/show_bug.cgi?id=733979
+// the combo is a composite widget so the way we do button linking doesn't
+// work, special case needed. See
+// https://bugzilla.gnome.org/show_bug.cgi?id=733979
 
-  &:dir(ltr),
-  &:dir(rtl) { @extend %linked_middle; } // specificity bump
+.linked:not(.vertical) > combobox {
+  &:not(:first-child) > box > button.combo { @extend %linked:not(:first-child); }
+  &:not(:last-child) > box > button.combo { @extend %linked:not(:last-child); }
 }
 
-.linked:not(.vertical) > combobox:first-child > box > button.combo { @extend %linked:first-child; }
-.linked:not(.vertical) > combobox:last-child > box > button.combo { @extend %linked:last-child; }
-.linked:not(.vertical) > combobox:only-child > box > button.combo { @extend %linked:only-child; }
-
-.linked.vertical > combobox > box > button.combo { @extend %linked_vertical_middle; }
-.linked.vertical > combobox:first-child > box > button.combo { @extend %linked_vertical:first-child;}
-.linked.vertical > combobox:last-child > box > button.combo { @extend %linked_vertical:last-child; }
-.linked.vertical > combobox:only-child > box > button.combo { @extend %linked_vertical:only-child; }
+.linked.vertical > combobox {
+  &:not(:first-child) > box > button.combo { @extend %linked_vertical:not(:first-child); }
+  &:not(:last-child) > box > button.combo { @extend %linked_vertical:not(:last-child); }
+}
 
 
 /************
index 69a15db18aef17be8abf01df93643f49976a7911..bb021ff7ba1842cbcb1a33501312d4b5801f16ef 100644 (file)
@@ -318,8 +318,6 @@ button.destructive-action:disabled:active, button.destructive-action:disabled:ch
 
 .stack-switcher > button.needs-attention:active > label, .stack-switcher > button.needs-attention:active > image, .stack-switcher > button.needs-attention:checked > label, .stack-switcher > button.needs-attention:checked > image { animation: none; background-image: none; }
 
-.inline-toolbar button, .inline-toolbar button:backdrop { border-radius: 2px; border-width: 1px; }
-
 .primary-toolbar button { -gtk-icon-shadow: none; }
 
 .stack-switcher > button.needs-attention > label, .stack-switcher > button.needs-attention > image, stacksidebar row.needs-attention > label { animation: needs_attention 150ms ease-in; background-image: radial-gradient(#ddd 68%, rgba(221, 221, 221, 0) 70%); background-size: 6px 6px; background-repeat: no-repeat; background-position: right 3px; }
@@ -346,21 +344,13 @@ button.destructive-action:disabled:active, button.destructive-action:disabled:ch
 
 .inline-toolbar toolbutton > button:backdrop:disabled:active, .inline-toolbar toolbutton > button:backdrop:disabled:checked { border-width: 2px; border-style: solid; color: gray; border-color: #494949; background-image: none; background-color: #090909; }
 
-toolbar.inline-toolbar toolbutton > button.flat, searchbar.inline-toolbar toolbutton > button.flat, toolbar.inline-toolbar toolbutton:backdrop > button.flat, searchbar.inline-toolbar toolbutton:backdrop > button.flat, .linked:not(.vertical) > spinbutton:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text, .linked:not(.vertical) > entry, .inline-toolbar button, .inline-toolbar button:backdrop, .linked > button, .linked > button:hover, .linked > button:active, .linked > button:checked, .linked > button:backdrop, .linked > combobox > box > button.combo:dir(ltr), .linked > combobox > box > button.combo:dir(rtl) { border-radius: 0; border-right-style: none; }
-
-.linked:not(.vertical) > spinbutton:dir(ltr):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):first-child, .linked:not(.vertical) > entry:dir(ltr):first-child, .inline-toolbar button:dir(ltr):first-child, .linked > button:dir(ltr):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):last-child, .linked:not(.vertical) > entry:dir(rtl):last-child, .inline-toolbar button:dir(rtl):last-child, .linked > button:dir(rtl):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(rtl) { border-top-left-radius: 3px; border-bottom-left-radius: 3px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-right-style: none; }
-
-.linked:not(.vertical) > spinbutton:dir(ltr):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):last-child, .linked:not(.vertical) > entry:dir(ltr):last-child, .inline-toolbar button:dir(ltr):last-child, .linked > button:dir(ltr):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):first-child, .linked:not(.vertical) > entry:dir(rtl):first-child, .inline-toolbar button:dir(rtl):first-child, .linked > button:dir(rtl):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-right-style: solid; }
-
-.linked:not(.vertical) > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:only-child, .linked:not(.vertical) > entry:only-child, .inline-toolbar button:only-child, .linked > button:only-child, toolbar.inline-toolbar toolbutton:only-child > button.flat, searchbar.inline-toolbar toolbutton:only-child > button.flat, toolbar.inline-toolbar toolbutton:backdrop:only-child > button.flat, searchbar.inline-toolbar toolbutton:backdrop:only-child > button.flat, .linked:not(.vertical) > combobox:only-child > box > button.combo { border-radius: 3px; border-style: solid; }
-
-.linked.vertical > spinbutton:not(.vertical), spinbutton.vertical .linked.vertical > text, .linked.vertical > entry, .linked.vertical > button, .linked.vertical > button:hover, .linked.vertical > button:active, .linked.vertical > button:checked, .linked.vertical > button:backdrop, .linked.vertical > combobox > box > button.combo { border-style: solid solid none solid; border-radius: 0; }
+.linked:not(.vertical) > spinbutton:dir(ltr):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:first-child), .linked:not(.vertical) > entry:dir(ltr):not(:first-child), .inline-toolbar button:dir(ltr):not(:first-child), .linked:not(.vertical) > button:dir(ltr):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:last-child), .linked:not(.vertical) > entry:dir(rtl):not(:last-child), .inline-toolbar button:dir(rtl):not(:last-child), .linked:not(.vertical) > button:dir(rtl):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
 
-.linked.vertical > spinbutton:first-child:not(.vertical), spinbutton.vertical .linked.vertical > text:first-child, .linked.vertical > entry:first-child, .linked.vertical > button:first-child, .linked.vertical > combobox:first-child > box > button.combo { border-top-left-radius: 3px; border-top-right-radius: 3px; }
+.linked:not(.vertical) > spinbutton:dir(ltr):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:last-child), .linked:not(.vertical) > entry:dir(ltr):not(:last-child), .inline-toolbar button:dir(ltr):not(:last-child), .linked:not(.vertical) > button:dir(ltr):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:first-child), .linked:not(.vertical) > entry:dir(rtl):not(:first-child), .inline-toolbar button:dir(rtl):not(:first-child), .linked:not(.vertical) > button:dir(rtl):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(rtl) { border-right-style: none; border-top-right-radius: 0; border-bottom-right-radius: 0; }
 
-.linked.vertical > spinbutton:last-child:not(.vertical), spinbutton.vertical .linked.vertical > text:last-child, .linked.vertical > entry:last-child, .linked.vertical > button:last-child, .linked.vertical > combobox:last-child > box > button.combo { border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-style: solid; }
+.linked.vertical > spinbutton:not(:first-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:first-child), .linked.vertical > entry:not(:first-child), .linked.vertical > button:not(:first-child), .linked.vertical > combobox:not(:first-child) > box > button.combo { border-top-left-radius: 0; border-top-right-radius: 0; }
 
-.linked.vertical > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked.vertical > text:only-child, .linked.vertical > entry:only-child, .linked.vertical > button:only-child, .linked.vertical > combobox:only-child > box > button.combo { border-radius: 3px; border-style: solid; }
+.linked.vertical > spinbutton:not(:last-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:last-child), .linked.vertical > entry:not(:last-child), .linked.vertical > button:not(:last-child), .linked.vertical > combobox:not(:last-child) > box > button.combo { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
 
 modelbutton.flat, popover.background checkbutton, popover.background radiobutton, .menuitem.button.flat, modelbutton.flat:backdrop, popover.background checkbutton:backdrop, popover.background radiobutton:backdrop, modelbutton.flat:backdrop:hover, popover.background checkbutton:backdrop:hover, popover.background radiobutton:backdrop:hover, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, button:link, button:visited, button:link:hover, button:link:active, button:visited:hover, button:visited:active, button:link:backdrop, button:visited:backdrop, notebook tab button, row.activatable, row.activatable:backdrop, row.activatable:backdrop:active, row.activatable:backdrop:checked, row.activatable:backdrop:disabled, row.activatable:backdrop:disabled:active, row.activatable:backdrop:disabled:checked, row.activatable:disabled:active, row.activatable:disabled:checked, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:backdrop:hover { background-color: transparent; background-image: none; border-color: transparent; box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); text-shadow: none; -gtk-icon-shadow: none; }
 
@@ -455,9 +445,9 @@ spinbutton.vertical text { min-height: 32px; min-width: 32px; padding: 0; border
 
 spinbutton.vertical button { min-height: 32px; min-width: 32px; padding: 0; }
 
-spinbutton.vertical button.up { border-radius: 3px 3px 0 0; border-style: solid solid none solid; }
+spinbutton.vertical button.up { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
 
-spinbutton.vertical button.down { border-radius: 0 0 3px 3px; border-style: none solid solid solid; }
+spinbutton.vertical button.down { border-top-style: none; border-top-left-radius: 0; border-top-right-radius: 0; }
 
 .osd spinbutton.vertical button:first-child { border-width: 2px; border-style: solid; color: #fff; background-image: none; background-color: rgba(0, 0, 0, 0.8); border-color: rgba(255, 255, 255, 0.2); }
 
index ded0353672bbb83e07ad67721aad1fdc316b54a5..12204410557c8b252bd4de05a63dcccdeed3d47f 100644 (file)
@@ -320,8 +320,6 @@ button.destructive-action:disabled:active, button.destructive-action:disabled:ch
 
 .stack-switcher > button.needs-attention:active > label, .stack-switcher > button.needs-attention:active > image, .stack-switcher > button.needs-attention:checked > label, .stack-switcher > button.needs-attention:checked > image { animation: none; background-image: none; }
 
-.inline-toolbar button, .inline-toolbar button:backdrop { border-radius: 2px; border-width: 1px; }
-
 .primary-toolbar button { -gtk-icon-shadow: none; }
 
 .stack-switcher > button.needs-attention > label, .stack-switcher > button.needs-attention > image, stacksidebar row.needs-attention > label { animation: needs_attention 150ms ease-in; background-image: radial-gradient(#000 68%, rgba(0, 0, 0, 0) 70%); background-size: 6px 6px; background-repeat: no-repeat; background-position: right 3px; }
@@ -348,21 +346,13 @@ button.destructive-action:disabled:active, button.destructive-action:disabled:ch
 
 .inline-toolbar toolbutton > button:backdrop:disabled:active, .inline-toolbar toolbutton > button:backdrop:disabled:checked { border-width: 2px; border-style: solid; color: gray; border-color: silver; background-image: none; background-color: #f6f6f6; }
 
-toolbar.inline-toolbar toolbutton > button.flat, searchbar.inline-toolbar toolbutton > button.flat, toolbar.inline-toolbar toolbutton:backdrop > button.flat, searchbar.inline-toolbar toolbutton:backdrop > button.flat, .linked:not(.vertical) > spinbutton:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text, .linked:not(.vertical) > entry, .inline-toolbar button, .inline-toolbar button:backdrop, .linked > button, .linked > button:hover, .linked > button:active, .linked > button:checked, .linked > button:backdrop, .linked > combobox > box > button.combo:dir(ltr), .linked > combobox > box > button.combo:dir(rtl) { border-radius: 0; border-right-style: none; }
-
-.linked:not(.vertical) > spinbutton:dir(ltr):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):first-child, .linked:not(.vertical) > entry:dir(ltr):first-child, .inline-toolbar button:dir(ltr):first-child, .linked > button:dir(ltr):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):last-child, .linked:not(.vertical) > entry:dir(rtl):last-child, .inline-toolbar button:dir(rtl):last-child, .linked > button:dir(rtl):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(rtl) { border-top-left-radius: 3px; border-bottom-left-radius: 3px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-right-style: none; }
-
-.linked:not(.vertical) > spinbutton:dir(ltr):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):last-child, .linked:not(.vertical) > entry:dir(ltr):last-child, .inline-toolbar button:dir(ltr):last-child, .linked > button:dir(ltr):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):first-child, .linked:not(.vertical) > entry:dir(rtl):first-child, .inline-toolbar button:dir(rtl):first-child, .linked > button:dir(rtl):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-right-style: solid; }
-
-.linked:not(.vertical) > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:only-child, .linked:not(.vertical) > entry:only-child, .inline-toolbar button:only-child, .linked > button:only-child, toolbar.inline-toolbar toolbutton:only-child > button.flat, searchbar.inline-toolbar toolbutton:only-child > button.flat, toolbar.inline-toolbar toolbutton:backdrop:only-child > button.flat, searchbar.inline-toolbar toolbutton:backdrop:only-child > button.flat, .linked:not(.vertical) > combobox:only-child > box > button.combo { border-radius: 3px; border-style: solid; }
-
-.linked.vertical > spinbutton:not(.vertical), spinbutton.vertical .linked.vertical > text, .linked.vertical > entry, .linked.vertical > button, .linked.vertical > button:hover, .linked.vertical > button:active, .linked.vertical > button:checked, .linked.vertical > button:backdrop, .linked.vertical > combobox > box > button.combo { border-style: solid solid none solid; border-radius: 0; }
+.linked:not(.vertical) > spinbutton:dir(ltr):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:first-child), .linked:not(.vertical) > entry:dir(ltr):not(:first-child), .inline-toolbar button:dir(ltr):not(:first-child), .linked:not(.vertical) > button:dir(ltr):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:last-child), .linked:not(.vertical) > entry:dir(rtl):not(:last-child), .inline-toolbar button:dir(rtl):not(:last-child), .linked:not(.vertical) > button:dir(rtl):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
 
-.linked.vertical > spinbutton:first-child:not(.vertical), spinbutton.vertical .linked.vertical > text:first-child, .linked.vertical > entry:first-child, .linked.vertical > button:first-child, .linked.vertical > combobox:first-child > box > button.combo { border-top-left-radius: 3px; border-top-right-radius: 3px; }
+.linked:not(.vertical) > spinbutton:dir(ltr):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:last-child), .linked:not(.vertical) > entry:dir(ltr):not(:last-child), .inline-toolbar button:dir(ltr):not(:last-child), .linked:not(.vertical) > button:dir(ltr):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:first-child), .linked:not(.vertical) > entry:dir(rtl):not(:first-child), .inline-toolbar button:dir(rtl):not(:first-child), .linked:not(.vertical) > button:dir(rtl):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(rtl) { border-right-style: none; border-top-right-radius: 0; border-bottom-right-radius: 0; }
 
-.linked.vertical > spinbutton:last-child:not(.vertical), spinbutton.vertical .linked.vertical > text:last-child, .linked.vertical > entry:last-child, .linked.vertical > button:last-child, .linked.vertical > combobox:last-child > box > button.combo { border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-style: solid; }
+.linked.vertical > spinbutton:not(:first-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:first-child), .linked.vertical > entry:not(:first-child), .linked.vertical > button:not(:first-child), .linked.vertical > combobox:not(:first-child) > box > button.combo { border-top-left-radius: 0; border-top-right-radius: 0; }
 
-.linked.vertical > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked.vertical > text:only-child, .linked.vertical > entry:only-child, .linked.vertical > button:only-child, .linked.vertical > combobox:only-child > box > button.combo { border-radius: 3px; border-style: solid; }
+.linked.vertical > spinbutton:not(:last-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:last-child), .linked.vertical > entry:not(:last-child), .linked.vertical > button:not(:last-child), .linked.vertical > combobox:not(:last-child) > box > button.combo { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
 
 modelbutton.flat, popover.background checkbutton, popover.background radiobutton, .menuitem.button.flat, modelbutton.flat:backdrop, popover.background checkbutton:backdrop, popover.background radiobutton:backdrop, modelbutton.flat:backdrop:hover, popover.background checkbutton:backdrop:hover, popover.background radiobutton:backdrop:hover, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, button:link, button:visited, button:link:hover, button:link:active, button:visited:hover, button:visited:active, button:link:backdrop, button:visited:backdrop, notebook tab button, row.activatable, row.activatable:backdrop, row.activatable:backdrop:active, row.activatable:backdrop:checked, row.activatable:backdrop:disabled, row.activatable:backdrop:disabled:active, row.activatable:backdrop:disabled:checked, row.activatable:disabled:active, row.activatable:disabled:checked, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:backdrop:hover { background-color: transparent; background-image: none; border-color: transparent; box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); text-shadow: none; -gtk-icon-shadow: none; }
 
@@ -459,9 +449,9 @@ spinbutton.vertical text { min-height: 32px; min-width: 32px; padding: 0; border
 
 spinbutton.vertical button { min-height: 32px; min-width: 32px; padding: 0; }
 
-spinbutton.vertical button.up { border-radius: 3px 3px 0 0; border-style: solid solid none solid; }
+spinbutton.vertical button.up { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
 
-spinbutton.vertical button.down { border-radius: 0 0 3px 3px; border-style: none solid solid solid; }
+spinbutton.vertical button.down { border-top-style: none; border-top-left-radius: 0; border-top-right-radius: 0; }
 
 .osd spinbutton.vertical button:first-child { border-width: 2px; border-style: solid; color: #fff; background-image: none; background-color: rgba(0, 0, 0, 0.8); border-color: rgba(255, 255, 255, 0.2); }